<template>
  <div class='toolbartitle'>基本信息</div>
  <el-scrollbar style='height: 100%' class="padding-lr-xs">
    <el-form ref='formRef' :model='formData' :rules='formRules' label-width='90px' class='form-input-m' inline-message>
      <el-row :gutter='20'>
        <el-col :span='12'>
          <el-form-item label='编码' prop='optNo'>
            <el-input v-model='formData.optNo' placeholder='请输入编码' clearable></el-input>
          </el-form-item>
        </el-col>
        <el-col :span='12'>
          <el-form-item label='名称' prop='optNa'>
            <el-input v-model='formData.optNa' placeholder='请输入名称' clearable @blur="addInputCode()"></el-input>
          </el-form-item>
        </el-col>
      </el-row>

      <el-row :gutter='20'>
        <el-col :span='12'>
          <el-form-item label='排序码' prop='seq'>
            <el-input v-model='formData.seq' placeholder='请输入排序码' clearable></el-input>
          </el-form-item>
        </el-col>

        <el-col :span='12'>
          <el-form-item label='助记符' prop='inputCode'>
            <el-input v-model='formData.inputCode' placeholder='请输入助记符' type='text' clearable></el-input>
          </el-form-item>
        </el-col>
      </el-row>
      <el-form-item label='细菌' prop='germNo'>
        <VxePulldownSelection style="width:100%;" :url="'/bac/germ/dict/getGermsByParams'" @confirmClick="SelectRowClick" :tableColumn="[
                            { type: 'seq', title: '#',width:'30px' },
                            { field: 'germNa', title: '名称' },
                            { field: 'germNo', title: '编码' },
                          ]" :aimKeys="[
                            { aimKey: 'germNa', rowKey: 'germNa' },
                            { aimKey: 'germNo', rowKey: 'germNo' }
                          ]" :displayTexts="['germNa']" :displayTextObj="formData.germNa ? formData.germNa : ''" />
      </el-form-item>
      <el-row :gutter='20'>
        <el-col :span='24'>
          <el-form-item>
            <el-button type='primary' @click='saveForm'>保存</el-button>
          </el-form-item>
        </el-col>
      </el-row>
    </el-form>
  </el-scrollbar>
</template>

<script lang='ts' setup>
// 引入组件区 ==========
import { ref, reactive, watch, getCurrentInstance, PropType } from 'vue';
import { VXETable, VxeFormPropTypes, VxeButtonEvents } from 'vxe-table';
import VxePulldownSelection from '@/components/VxePulldownSelection.vue';
import { VxeMessage, VxeNotifyType } from '@/utils/CommonMessage';
import SelectDataList from '@/components/SelectDataList.vue';
import { funBdsJsResult } from '@/utils/Expression'; //函数公式

// 全局变量定义区 ==========
let { proxy }: any = getCurrentInstance();
const formRef = ref(); //表单ref标记

// 表单绑定的数据
let formData: any = reactive({
  id: '' /*主键*/,
  optNo: '' /*编码*/,
  optNa: '' /*名称*/,
  germNo: '' /*细菌编号*/,
  germNa: '' /*细菌名称*/,
  inputCode: '',
  seq: 1,
});

// 表单校验规则
const formRules = reactive<VxeFormPropTypes.Rules>({
  code: [{ required: true, message: '请输入' }],
  name: [{ required: true, message: '请输入' }],
  shortName: [{ required: true, message: '请输入' }]
});

let employeeSelectRef: any = ref(null);
let employeeSelectRef1: any = ref(null);

let visibleOutReporter: any = ref(false);
let visibleOutReporter1: any = ref(false);

defineExpose({
  addNew,
  saveForm,
  clearFormData
});

// 父组件传值
let emit = defineEmits(['findListData']);
let props = defineProps({
  currentRow: { type: Object as PropType<any>, required: true }
}) as any;

watch(
  () => props.currentRow,
  (nval, oval) => {
    Object.assign(formData, nval);
  },
  {
    deep: true,
    immediate: true
  }
);

// 方法定义区 =============
function addNew(callback) {
  clearFormData(callback);
  if (callback) {
    callback({ a: '初始化完成' });
  }
}

// 清空表单
function clearFormData(callback) {
  formData.id = '';
  formData.optNo = '';
  formData.optNa = '';
  formData.germNo = '';
  formData.germNa = '';
  formData.inputCode = '';
  formData.seq = 1;
  if (callback) {
    callback(true);
  }
}

// 保存描述性结果
function saveForm(callback: any) {
  const el: any = proxy.$refs['formRef'];
  formRef.value?.validate((valid: any) => {
    if (!valid) {
      VxeMessage('验证失败', VxeNotifyType.error);
      return false;
    }
    let url = '';
    // 判断添加和编辑接口
    if (formData.id) {
      url = '/api/bac/bac-desc-option/updateBacDescOption';
      if (IsEmpty(formData.germNo)) {
        formData.germNo = '';
      }
      if (IsEmpty(formData.germNa)) {
        formData.germNa = '';
      }
    } else {
      url = '/api/bac/bac-desc-option/addBacDescOption';
    }
    // emits: ['findListData'],
    proxy.$http
      .post(url, formData)
      .then((res: any) => {
        if (res.status.code === 1) {
          if (formData.id) {
            emit('findListData');
            VxeMessage('修改字典成功', VxeNotifyType.success);
          } else {
            emit('findListData');
            VxeMessage('新增字典成功', VxeNotifyType.success);
          }
          if (callback) {
            callback(true);
          }
        } else {
          if (formData.id) {
            emit('findListData');
            VxeMessage('修改字典失败', VxeNotifyType.error);
          } else {
            emit('findListData');
            VxeMessage('新增字典失败', VxeNotifyType.error);
          }
          if (callback) {
            callback(false);
          }
        }
      })
      .catch((err: any) => {
        // VxeMessage('保存异常', VxeNotifyType.error);
        // if (callback) {
        //   callback(false);
        // }
      });
  });
}

function vxePullDownConfirm(e) {
  e.aimKeys.forEach((item: any) => {
    if (e.isChild) {
      //todo
    } else {
      formData[item.targetField] = e.row[item.sourceField];
    }
  });
}

// 组件
//点击选择的那一项受检单位
function SelectRowClick(e) {
  e.aimKeys.forEach(r => {
    formData[r.aimKey] = e.row[r.rowKey];
  });
  visibleOutReporter.value = false;
}

// 组件
//点击选择的那一项受检单位
function SelectRowClick1(row) {
  formData.reportUnitId = row.id;
  formData.reportUnitCode = row.reportGroupCode;
  formData.reportUnitName = row.reportGroupName;
  visibleOutReporter1.value = false;
}

// 填写仪器名称 自动生成助记符
function addInputCode() {
  formData.inputCode = funBdsJsResult('firstPinYinFun', formData.optNa);
}
//**判断为空*/
function IsEmpty(value: any) {
  if (value === undefined || value === '' || value === null) {
    return true;
  }
  if (JSON.stringify(value) === '{}') {
    return true;
  }
  return false;
}
</script>
<style lang='scss' scoped>
.el-tag {
  color: $base-white;
}
</style>